<template>
    <el-dialog v-model="dialogFormVisible" :title="title" @close="closeDialog" style="width:45%;">
        <el-form :model="addBasePanForm" ref="addBaseTaskRef" :rules="addBaseTaskrules">
            <el-form-item label="财产名称" :label-width="formLabelWidth" prop="name">
                <el-input v-model="addBasePanForm.name" autocomplete="off" ref="name" placeholder="请填写财产名称"></el-input>
            </el-form-item>
            <el-form-item label="资产编号" :label-width="formLabelWidth" prop="code" v-if="id">
                <el-input v-model="addBasePanForm.code" autocomplete="off" ref="code" placeholder="请填写资产编号"></el-input>
            </el-form-item>
            <el-form-item label="财产编号" :label-width="formLabelWidth" prop="oldCode" v-if="id">
                <el-input v-model="addBasePanForm.oldCode" autocomplete="off" ref="oldCode"
                    placeholder="请填写财产编号"></el-input>
            </el-form-item>
            <el-form-item label="购进日期" :label-width="formLabelWidth" prop="purchaseDate" format="YYYY-MM-DD">
                <!-- <el-date-picker v-model="addBasePanForm.timeDate" type="daterange" range-separator="到"
                    start-placeholder="请选择开始时间" end-placeholder="请选择结束时间" :size="size" /> -->
                <el-config-provider :locale="locale">
                    <el-date-picker v-model="addBasePanForm.purchaseDate" type="date" placeholder="请选择购进日期"
                        style="width: 100%;" />
                </el-config-provider>
            </el-form-item>
            <el-form-item label="使用人" :label-width="formLabelWidth" prop="useTeacher">
                <el-input v-model="addBasePanForm.useTeacher" autocomplete="off" ref="useTeacher"
                    placeholder="请填写使用人"></el-input>
            </el-form-item>
            <el-form-item label="存放地点" :label-width="formLabelWidth" prop="place">
                <el-input v-model="addBasePanForm.place" autocomplete="off" ref="place"
                    placeholder="请填写存放地点"></el-input>
            </el-form-item>
            <el-form-item label="校区" :label-width="formLabelWidth" prop="campus">
                <el-radio-group v-model="addBasePanForm.campus" @change="changeHandelr">
                    <el-radio :value="1" label="1">{{ campusName }}</el-radio>
                    <el-radio :value="2" label="2">{{ campusName1 }}</el-radio>
                </el-radio-group>
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer">
                <el-button @click="cancel()">取消</el-button>
                <el-button type="primary" @click="save()">保存</el-button>
            </span>
        </template>
    </el-dialog>
</template>

<script>
import { ref } from "vue";
import { httpService } from "@/utils/httpService";
import { ElMessage, ElForm } from "element-plus";
import { vxRule } from "@/utils/validator";
import zhCn from "element-plus/lib/locale/lang/zh-cn";
import { API_BASE_NAME2, API_BASE_NAME3 } from '../../constants';
export default {
    name: "AddBaseAddress",
    components: { ElForm, ElMessage },
    data() {
        return {
            campusName: API_BASE_NAME2,
            campusName1: API_BASE_NAME3,
            dialogFormVisible: ref(false),
            formLabelWidth: "120px",
            title: "",
            personnelType: "",
            id: '',
            campus: 1,
            data: {},
            addBasePanForm: {
                id: "",
                name: '',
                code: '',
                useTeacher: '',
                purchaseDate: '',
                place: '',
                oldCode: '',
                campus: '',
                flag: '',
            },
            // 校验规则
            addBaseTaskrules: {
                name: vxRule(true, null, "blur"),
                code: vxRule(true, null, "blur"),
                useTeacher: vxRule(true, null, "blur"),
                purchaseDate: vxRule(true, null, "blur"),
                place: vxRule(true, null, "blur"),
                oldCode: vxRule(true, null, "blur"),
                campus: vxRule(true, null, "blur"),
                flag: vxRule(true, null, "blur"),
            },
        };
    },
    setup() {
        return {
            locale: zhCn,
        };
    },
    mounted() {
        // this.data = this.addBasePanForm
        if (this.title == '新增') {
            this.clear()
        }
    },
    watch: {
        data(newValue) {
            this.addBasePanForm = newValue
        },
    },
    methods: {
        changeHandelr(value) {

        },

        closeDialog() {
            this.clear();
        },
        cancel() {
            this.dialogFormVisible = false;
            this.clear();
        },
        getTaskById(id) {
            httpService("/javaApi/faTask/queryById", { id: id }, "get").then(
                (data) => {
                    this.addBasePanForm = data;
                }
            );
        },
        clear() {
            this.dialogFormVisible = false;
            //清空form
            this.title = ''
            this.id = ''
            // this.addBasePanForm.id = ""
            // this.addBasePanForm.name = ''
            // this.addBasePanForm.code = ''
            // this.addBasePanForm.useTeacher = ''
            // this.addBasePanForm.purchaseDate = ''
            // this.addBasePanForm.place = ''
            // this.addBasePanForm.oldCode = ''
            // this.addBasePanForm.campus = ''
            // this.addBasePanForm.flag = ''
        },
        save() {

            this.$refs.addBaseTaskRef.validate((valid) => {

                if (valid) {
                    let params = new FormData(); //创建一个form对象,必须是form对象否则后端接受不到数据
                    params.append("useTeacher", this.addBasePanForm.useTeacher);
                    params.append("purchaseDate", this.addBasePanForm.purchaseDate);
                    params.append("place", this.addBasePanForm.place);
                    params.append("campus", this.addBasePanForm.campus);

                    if (this.id) {
                        params.append("id", this.id);
                        params.append("flag", 1);
                        httpService("/javaApi/faSubListInventory/edit", params, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success("盘点成功");
                                    this.clear();
                                    //刷新父组件的数据
                                    this.$parent.getFaTaskList();
                                } else {
                                    ElMessage.error("盘点失败");
                                }
                            }
                        );
                    } else {
                        httpService("/javaApi/faTask/add", params, "post").then(
                            (data) => {
                                if (data.code == 200) {
                                    ElMessage.success("添加成功");
                                    this.clear();
                                    this.$parent.getFaTaskList();
                                } else {
                                    ElMessage.error("添加失败");
                                }
                            }
                        );
                    }
                } else {
                    return false;
                }
            });
        },
        getDate(time) {
            const date = new Date(time)
            const year = date.getFullYear();
            const month = (date.getMonth() + 1) < 10 ? '0' + (date.getMonth() + 1) : (date.getMonth() + 1)
            const day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()
            const hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
            const minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
            const seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()

            const formattedDateTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
            return formattedDateTime
        },
    },
};
</script>
<style>
.el-dialog__header {
    padding: var(--el-dialog-padding-primary);
    padding-bottom: 10px;
    border-bottom: 1px solid #dedede;
    margin-bottom: 15px;
}
</style>